<script setup>

</script>

<template>
  <div style="padding: 20px;">
    <h2>添加数据</h2>
    <el-form :model="form" label-width="80px">
      <el-row>
        <el-col :span="24">
          <el-form-item label="标题:" prop="title">
            <el-input style="max-width: 400px" v-model="form.title"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="子标题:" prop="subTitle">
            <el-input style="max-width: 400px" v-model="form.subTitle"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="索引号:" prop="indexNo">
            <el-input style="max-width: 400px" v-model="form.indexNo"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="文号:" prop="articleNo">
            <el-input style="max-width: 400px" v-model="form.articleNo"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="发文机构:" prop="department">
            <el-input style="max-width: 400px" v-model="form.department"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="模块:" prop="type">
            <el-input style="max-width: 400px" v-model="form.type"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="pdf地址:" prop="type">
            <el-input style="max-width: 400px" v-model="form.pdfUrl"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form-item label="doc地址:" prop="type">
            <el-input style="max-width: 400px" v-model="form.docUrl"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form-item label="主体内容:" prop="type">
           <div>
             <Editor
               style="width: 600px;height: 300px; overflow-y: hidden;"
               v-model="form.content"
               :defaultConfig="editorConfig"
               :mode="mode"
               @onCreated="onCreated"
             />
           </div>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <div style="display: flex;justify-content: end;max-width: 400px" >
            <el-button type="primary" block @click="handlerSubmit">提交</el-button>
            <el-button type="primary" block @click="()=>{
              $router.push('/gongkai/gongkai/index')
            }"
            >返回
            </el-button>
          </div>
        </el-col>
      </el-row>
    </el-form>


  </div>
</template>
<script>
import api from '@/api/users'

export default {
  data() {
    return {
      editor: null,
      toolbarConfig: { },
      editorConfig: { placeholder: '请输入内容...' },
      mode: 'default', // or 'simple'
      form: {
        title: '',
        subTitle: ''
      }
    }
  },
  beforeDestroy() {
    const editor = this.editor
    if (editor == null) return
    editor.destroy() // 组件销毁时，及时销毁编辑器
  },
  methods: {
    onCreated(editor) {
      this.editor = Object.seal(editor) // 一定要用 Object.seal() ，否则会报错
    },
    handlerSubmit() {
      api.xing_zheng_gong_kai_post(this.form).then(() => {
        this.$notify.success({
          title: '提示',
          message: '操作成功'
        })
      })
    }
  }
}
</script>

<style scoped lang="scss">

</style>
